{extend name='template/base'}{/extend}
{block name='style'}{/block}
{block name='script'}{/block}
{block name='content'}
<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-body">
                <div id="toolbar">
                    <div class="form-group pull-left mr10">
                        <select class="form-control select2" id="sel_status">
                            <option selected="selected" value="-1">全部状态</option>
                            <option value="0">未领取礼品</option>
                            <option value="1">已领取礼品</option>
                        </select>
                    </div>
                    <div class="form-group pull-left mr10" style="margin-left: 10px;">
                        <select class="form-control select2" id="sel_paytype">
                            <option selected="selected" value="-1">全部状态</option>
                            <option value="0">未支付</option>
                            <option value="1">已支付</option>
                        </select>
                    </div>

                    <span class="pull-left" style=" margin: 0px 10px 0 30px;">从</span>
                    <input class="form-control datetimepicker pull-left" style="width: 150px;" type="text" name="begindate" id="begindate"  placeholder="开始日期"/>
                    <span class="pull-left" style=" margin: 0px 10px 0 10px;">至</span>
                    <input class="form-control datetimepicker pull-left" style="width: 150px;" type="text" name="enddate" id="enddate" placeholder="开始日期"/>

                    <button type="button" class="btn btn-danger" id="btn_search" style="margin-bottom: 5px;margin-left: 15px"><span class="glyphicon glyphicon-search mr5"></span>搜索</button>

                </div>
                <table id="table"
                       data-toggle="table"
                       data-striped ="true"
                       data-toolbar ="#toolbar"
                       data-search="true"
                       data-show-refresh="true"
                       data-query-params = "requestParam"
                       data-show-toggle="true"
                       data-show-columns="true"
                       data-show-export="true"
                       data-side-pagination="server"
                       data-pagination="true"
                       data-id-field="id"
                       data-url="{:url('ShopRegUserOrder/index_data')}"
                >
                    <thead>
                    <tr>
                        <th data-field="id">ID</th>
                        <th data-field="order_sn">订单编号</th>
                        <th data-field="account_name">会员名称</th>
                        <th data-field="goods_name">礼品名称</th>
                        <th data-field="flag_pay" data-formatter="formatPayStatus">支付状态</th>
                        <th data-field="pay_time" data-formatter="formatTime">支付时间</th>
                        <th data-field="flag_gift" data-formatter="formatGitStatus">礼品领取</th>
                        <th data-field="take_gift_time" data-formatter="formatTime">礼品领取时间</th>
                        <th data-field="flag_get_coupon" data-formatter="formatGitStatus">优惠券</th>
                        <th data-field="flag_vip_coupon" data-formatter="formatVipStatus">VIP抵扣券</th>
                        <th data-field="order_time" data-formatter="formatTime">订单时间</th>
                        <th data-field="operate" data-formatter="formatOperate" data-events="operateEvents" >操作</th>
                    </tr>
                    </thead>
                </table>
            </div><!-- /.box-body -->
        </div><!-- /.box -->

    </div><!-- /.col -->
</div><!-- /.row -->
{/block}
{block name='script_extra'}
<script>
    var grant_gift_data_url="{:url('ShopRegUserOrder/grant_gift')}";
    var detail_data_url="{:url('ShopRegUserOrder/detail')}";
</script>
<script>
    $('.datetimepicker').datetimepicker({
        format: "Y-m-d",
        lang: 'ch',
        timepicker: false
    });
</script>
<script>
    // <editor-fold defaultstate="collapsed" desc="格式化url">
    function urlFormat(url) {
        if( url.indexOf('.html')){
            url=url.replace('.html','')
        }
        return url;
    }
    // </editor-fold>


    $("#sel_status").on('change', function () {
        $('#table').bootstrapTable('refresh');
    })
    $("#sel_paytype").on('change', function () {
        $('#table').bootstrapTable('refresh');
    })

    //搜索按钮事件
    $("#btn_search").on('click', function () {
        $('#table').bootstrapTable('refresh');
    })


    var temp = {};
    function requestParam(params) {
        temp = {
            limit: params.limit, //页面大小
            offset: params.offset, //页码
            order: params.order,
            sort: params.sort,
            search: params.search,
            islicense: -1,
            status: $("#sel_status").val(),
            type: $("#sel_paytype").val(),
            begindate: $("#begindate").val(),
            enddate: $("#enddate").val()
        };
        return temp;
    }


    // <editor-fold defaultstate="collapsed" desc="操作按钮">
    function formatOperate(value,row,index){
        return [
            '<button class="btn btn-success btn-xs row_detail" href="javascript:void(0)">',
            '<i class="fa fa-edit"></i> 详情',
            '</button>&nbsp;',
            '<button class="btn btn-warning btn-xs row_grant_gift" href="javascript:void(0)">',
            '<i class="fa fa-edit"></i> 礼品审核',
            '</button>&nbsp;',
        ].join('');
    }

    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="操作函数">
    window.operateEvents = {
        'click .row_grant_gift': function (e, value, row, index) {
            layer_open('审核',urlFormat(grant_gift_data_url)+"/id/"+row.id);
        },
        'click .row_detail': function (e, value, row, index) {
            layer_open('订单信息',urlFormat(detail_data_url)+"/id/"+row.id);
        },

    }

    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="时间格式化">
    function formatTime(value) {
        if(value){
            var date = new Date(parseInt(value) * 1000);
            Y = date.getFullYear() + '-';
            M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
            D = (date.getDate() + 1 < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';
            h = (date.getHours() + 1 < 10 ? '0' + (date.getHours()) : date.getHours()) + ':';
            m = (date.getMinutes() + 1 < 10 ? '0' + (date.getMinutes()) : date.getMinutes()) + ':';
            s = (date.getSeconds() + 1 < 10 ? '0' + (date.getSeconds()) : date.getSeconds());
            return Y + M + D + h + m + s;
        }

    }
    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="状态格式化">
    function formatPayStatus(value) {
        switch(value){
            case 0:
                return '<i class="fa fa-check-circle text-yellow" title="未支付">未支付</i>';break;
            case 1:
                return '<i class="fa fa-minus-circle text-green" title="已支付">已支付</i>';break;
        }

    }
    function formatGitStatus(value) {
        switch(value){
            case 0:
                return '<i class="fa fa-minus-circle text-yellow" title="未领取">未领取</i>';break;
            case 1:
                return '<i class="fa fa-check-circle text-green" title="已领取">已领取</i>';break;
        }
    }
    function formatVipStatus(value) {
        switch(value){
            case 0:
                return '<i class="fa fa-minus-circle text-yellow" title="未领取">未领取</i>';break;
            case 1:
                return '<i class="fa fa-check-circle text-green" title="已领取">已领取</i>';break;
            case 2:
                return '<i class="fa fa-check-circle text-green" title="已领取">已使用</i>';break;
        }
    }


    // </editor-fold>

</script>
{/block}